<template>
    <view class="content" >
      <uniPopup background-color="rgba(255,255,255,0)" ref="inputDialog"  type="dialog" >
        <div class="mboxContent">
            <div class="top">
                姓名修改
            </div>
          <div class="main">
            <input type="text"  placeholder-class="inputP"  placeholder="请输入您的真实姓名(必填)" v-model.trim="names" maxlength="10">
            <div class="btn">
              <button class="success" @click="toRight">确认</button>
     
              
            </div>
          </div>
        
         
         
        </div>
          
              </uniPopup>
              
    </view>
  </template>
  
  <script>
   	import dialogs from "@/components/dialog.vue";
import {decode,updateUsername } from "@/utils/http"
  import uniPopup from "@/uni_modules/uni-popup/components/uni-popup/uni-popup.vue";
  export default {
      components:{
      uniPopup,
      dialogs,
      
    },
    props: {
    oldName:{
      type:String,

    }
    },
    data() {
      return {
        names:uni.getStorageSync('userInfo').name,
        isUse:true
      
      };
    },
  
    onLoad() {},
    methods: {
      toRight(){
        uni.showLoading({
        title: "加载中",
        mask: true,
      });
        var that =this
        if(this.isUse){
          this.isUse=false
          if(!this.names){
            this.isUse=true
          uni.showToast({
								title:'请输入姓名',
								icon:'none',
								duration:1500
							})
              return
        }
        let form ={
                  openId:uni.getStorageSync('openid'),
                  name:that.names
                }
        uni.setStorageSync('account',this.names)
        updateUsername(form).then(a=>{
                  if(a.code=='0'){
                  
                    uni.setStorageSync('account',this.names)
         var s =uni.getStorageSync('userInfo');
         s.name=this.names;
         uni.setStorageSync('userInfo',s)
         uni.showToast({
								title:'修改成功',
								icon:'success',
								duration:1000,
                success:()=>{
                  setTimeout(()=>{
                    this.toClose()

                  },1000)
                  this.isUse=true

                }
							})
                  }
                }).finally(()=>{
                  // uni.hideLoading()

                })
        }
   
      },
    
      toClose(){
        this.$emit('closeAll',true)
        this.$refs.inputDialog.close()
      }
     
     
    },
  };
  </script>
  
  <style scoped >
  
  .mboxContent{
    text-align: center;
   
    background: white;
    box-sizing: content-box;
    /* padding:24px; */
    width: 540rpx;
    border-radius: 20px;
  
  }
  .top{
    font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 34rpx;
color: #262626;
line-height: 24rpx;
font-style: normal;
box-sizing: border-box;
padding: 36rpx;
border-bottom: 2rpx solid #CBCBCB;
  }
  .main{
    min-height: 362rpx;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .mainText{
    font-family: Source Han Sans CN, Source Han Sans CN;
  font-weight: bold;
  font-size: 34rpx;
  color: #262626;
  font-style: normal;
  }
  .rightimg{
width: 64rpx;
height: 64rpx;
margin:48rpx auto 32rpx
  }
  input{
    box-sizing: content-box;
    padding: 14rpx 9rpx;
    width: 430rpx;
    border: 1rpx solid #707070;
    background: #E9E9E9;
margin: 0 auto 0;
text-align: left;
    border-radius: 14rpx;
  }

  .btn{
 
border-radius: 32rpx 32rpx 32rpx 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 32rpx;
color: #FFFFFF;
font-style: normal;
text-transform: none;
  }
  .success{
    width: 251rpx;
height: 64rpx;
background: #58BE6B;
border-radius: 32rpx 32rpx 32rpx 32rpx;
margin: 48rpx auto 0;
line-height: 64rpx;
border: none;
color: white;

  }
  
  </style>
    <style scoped>
    input >>> .inputP {
        color: #B7B7B7;
        font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
font-weight: normal;
font-size: 28rpx;
color: #B7B7B7;
  }
  </style>